import React from 'react'
import { usercon, usertop, usercenter, img } from "./usercss/user.module.css"
import imgurl from "./photo/tupian.jpg"
import Foot from "../../components/foot_router/foot_router"
import Nine from "./compon/user/nine.js"
import Token1 from "./compon/user/token/token1.js"
import Token2 from "./compon/user/token/token2.js"
import { connect } from "react-redux"

class User extends React.Component {
    componentDidMount() {
        if (this.props.token.token === "000000") {
            this.setState({
                token: true
            })
        } else {
            this.setState({
                token: false ,
                nickname  : this.props.user.data.username
            })
        }
    }
    state = {
        token: "",
        img: "",
        nickname:"",
    }

    render() {
        return (
            <>
                <div className={usercon}>
                    <div className={usertop}>
                        {this.state.token ? <Token1 /> : <Token2 nickname={this.state.nickname} />}
                        <div><img className={img} src={imgurl} alt="标签" /></div>
                    </div>
                </div>
                <div className={usercenter}></div>
                <div className={usercon}>
                    <Nine flag={this.state.token} />
                </div>
                <Foot />
            </>
        )
    }
}

export default connect(
    state => ({
        token: state.token,
        user: state.user
    })
)(User)
